<template>
  <div class="footer">
    <div class="play-bar">
      <div class="paly-bar-options">
        <el-button
          type="success"
          circle
          @click="openFileAd"
          :loading="isLoading"
          :icon="House"
          title="打开合成视频文件夹"
        />
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import { useTtsStore } from "@/store/store";
import { storeToRefs } from "pinia";
import { House } from '@element-plus/icons-vue';
const { ipcRenderer } = require("electron");
const ttsStore = useTtsStore();
const { config, isLoading } = storeToRefs(ttsStore);

const openFileAd = () => {
  ipcRenderer.send("openFileFolder", config.value.savePath)
};
</script>

<style scoped>
.footer {
  background-color: #fff;
  border: 1px solid #dcdfe6;
  border-bottom-right-radius: 10px;
  border-top-left-radius: 5px;
  height: 58px;
  align-items: center;
}
.play-bar {
  display: flex;
  justify-content: center;
  align-items: center;
}
.paly-bar-options {
  width: 70px;
}
.paly-bar-process {
  width: 60%;
}
</style>
